<template>
    <div>

        <el-card class="box-card-auth">
            <div slot="header" class="clearfix">
                <span>注册码</span>
            </div>
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">

                <el-form-item label="类型：" prop="type">
                    <el-radio-group v-model="ruleForm.type" @input="onBlur($event)">
                        <el-radio label="0">下载注册码</el-radio>
                        <el-radio label="1">下载二维码</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label=""  v-if="ruleForm.type == 0">
                    <el-input type="textarea" v-model="urltext" :rows="6"></el-input>
             

                </el-form-item>

                <el-form-item label=""  v-if="ruleForm.type == 1">
                   
                    <img  style="width: 200px; height: 200px" :src="urltext" />

                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm('1')">下载授权文件</el-button>
                </el-form-item>

                <el-form-item label="">
                    <el-upload class="upload-demo" ref="upload" :action="uploadFileUrl" :on-success="handleUploadSuccess"
                        :file-list="fileList" :auto-upload="false" :limit="1" :on-change="handleChange"
                        :on-exceed="handleExceed" :on-remove="handleRemove">
                        <el-button slot="trigger" size="small" type="primary">选择文件</el-button>
                        <el-button style="margin-left: 10px;" size="small" type="success"
                            @click="submitForm('2')">授权</el-button>
                    </el-upload>
                </el-form-item>
            </el-form>
        </el-card>


    </div>
</template>
<script>
import { download, uploadLicense } from "@/api/authorizationFunction.js"
import axios from "axios";
import { getToken } from "@/utils/auth";
export default {
    data() {
        return {
            ruleForm: {
                type: undefined
            },
            rules: {
                type: { required: true, message: '请选择类型', trigger: 'change' }
            },
            urltext: undefined,

            uploadFileUrl: process.env.VUE_APP_BASE_API + "/archive/license/uploadLicense", // 上传文件服务器地址

            fileList: [],
        }
    },
    created() {

    },
    methods: {
        onBlur(val) {
         
            if (val == '0') {

                download(this.ruleForm).then(res => {

                    this.urltext = JSON.stringify(res)

                })

            } else {


                axios({
                method: 'POST',
                url: process.env.VUE_APP_BASE_API + `/archive/license/download`,
                params:this.ruleForm,
                headers: {
                  Authorization: "Bearer " + getToken()
                },
                responseType: 'blob' // 更改responseType类型为 blob
              }).then(res => {

                const blob = new Blob([res.data], {
                  type: "image/jpeg",
                })
                this.urltext = window.URL.createObjectURL(blob)
               console.log(this.urltext)
              }).catch(err => {
                console.log(err)
             
              })
              
            }


        },
        submitForm(val) {
            var that = this;
            if (val == 1) {
                this.$refs["ruleForm"].validate((valid) => {
                    if (valid) {
                        var type = ''
                        if (this.ruleForm.type == '0') {
                            type = 'txt'
                        } else {
                            type = 'png'
                        }
                        that.download("/archive/license/download", {
                            ...this.ruleForm,
                        }, `shouquan_${new Date().getTime()}.${type}`)



                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            } else {
                // 检查fileList是否为空  
                if (this.fileList.length === 0) {
                    this.$message.error('请先选择文件！'); // 使用Element UI的Message组件显示错误提示  
                    return; // 阻止后续代码执行  
                }
                this.$refs.upload.submit();
            }

        },

        handleChange(files, fileList) {
            console.log(files, fileList, "sldkfjlsdkjfkl")
            this.fileList = fileList;
        },
        handleExceed(files, fileList) {
            this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
        },
        // 上传成功回调
        handleUploadSuccess(res, file, fileList) {
            console.log(res, file, fileList)
            if (res.code === 200) {
                this.$alert(res.data.msg, {
                    confirmButtonText: '确定',
                    showClose: false,
                    callback: action => {
                        this.$router.push("/login");
                    }
                });
            } else {
                this.$message.warning(res.msg)
            }
        },

        handleRemove(file, fileList) {
            console.log(file, fileList);
            this.fileList = [];
        },
    }
}
</script>
<style scoped>
.box-card-auth {
    width: 40%;
    margin: 20% auto 0;
}
</style>